class List {
    constructor() {
        this.getData();
        this.$('.pagination-lg').addEventListener('click', this.paging.bind(this));
    }

    // 分页的实现
    paging(eve) {
        // 判断点击的是那个
        let tar = eve.target
        // console.log(tar);
        let ele = 1;

        // 获取当前页码
        let current = Number(localStorage.getItem('current'));

        // 点击页码
        if (tar.classList.contains('page')) {
            // console.log(tar.innerHTML);
            ele = tar.innerHTML;
        }

        // 上一页
        if (tar.classList.contains('pageReduce')) {
            if (current == 1) {
                ele = 1;
                layer.msg('已经是第一页了');
            } else {
                ele = current - 1;
            };
        }

        // 下一页
        if (tar.classList.contains('pagePlus')) {
            if (current == 5) {
                ele = 5;
                layer.msg('已经是最后一页了');
            } else {
                ele = current + 1;
            };
        }

        this.getData(ele);
    }

    /*****数据的获取*****/
    async getData(ele = 1) {
        // 发送ajax请求获取数据
        let current = ele;
        let { data, status } = await axios.get('http://localhost:8888/goods/list?current=' + current);
        // console.log(data, status);
        if (status != 200 || data.code != 1) return;
        let html = '';
        data.list.forEach(goods => {
            html += `<li class="sk_goods" onclick="List.goDetails(${goods.goods_id})">
            <a href="#"><img src="${goods.img_big_logo}" alt=""></a>
            <h5 class="sk_goods_title">【超级爆款】${goods.title}</h5>
            <p class="sk_goods_price"><em>¥${goods.current_price}</em> <del>￥${goods.price}</del></p>
            <div class="sk_goods_progress">
                已售<i>${goods.sale_type}</i>
                <div class="bar">
                    <div class="bar_in"></div>
                </div>
                剩余<em>${goods.goods_number}</em>件
            </div>
            <a href="#none" class="sk_goods_buy">立即抢购</a>
        </li>`
        })

        // 输出当前页码
        localStorage.setItem('current', data.yourParams.current);

        this.$('.sk_bd ul').innerHTML = html;
    }

    // 点击跳转到详情页
    static goDetails(goodsId) {

        // console.log(typeof (goodsId));
        // console.log(goodsId);
        // 设置编码方式
        axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded';

        // 发送ajax请求，跳转到详情页
        // let param = `id=${goodsId}`;
        axios.get('http://localhost:8888/goods/item?id=' + goodsId).then(({ status, data }) => {
            // console.log(status, data);

            localStorage.setItem('goodsId', data.info.goods_id);

            // 跳转到详情页
            location.assign('../html/product.html')
        })
    }

    // 获取节点的方法
    $(ele) {
        let res = document.querySelectorAll(ele);
        return res.length == 1 ? res[0] : res;
    }
}

new List;